<template>
	<view class="main">
		<cu-custom>
			<block slot="content">首页</block>
		</cu-custom>
		<cover-image  :src="getFileLocalPath('/static/images/bg.png')"></cover-image>
		<view class="main">
			<!--左侧小区名称 右侧新增登记-->
			<view id="head1" class="flex justify-around margin-top-sm ">
				<!-- <view url="site_list/site_list" class="flex align-center" @click="SelectSite">
					<text class="text-white text-xl">{{site.name}}</text>
					<view class="cuIcon-triangledownfill text-white" style="font-size: 50upx"></view>
				 </view>-->
				<view></view><view></view><view></view><view></view>
				<view class="flex align-center">
					<!-- <navigator url="addtask/add-task"> -->
						<view class="cuIcon-add text-white text-bold" style="font-size: 50upx"></view>
					<!-- </navigator> -->
				</view>
			</view>
			<!--社区出行概况-->
			<view id="chuxing" class="flex  justify-center align-center margin-top-sm">
				<view class="head_box">

					<view class="flex justify-around text-df padding-top">
						<text>站点运维情况</text>
						<text>（单位：次）</text>
					</view>
					<view class="flex justify-around padding-top-xl">
						<view class="flex flex-direction align-center">
							<text class="text-orange text-bold">{{count.new}}</text>
							<text>新增</text>
						</view>
						<view class="flex flex-direction align-center">
							<text class="text-orange text-bold">{{count.see}}</text>
							<text>查看</text>
						</view>
						<view class="flex flex-direction align-center">
							<text class="text-orange text-bold">{{count.operating}}</text>
							<text>进行中</text>
						</view>
						<view class="flex flex-direction align-center">
							<text class="text-orange text-bold">{{count.complete}}</text>
							<text>已完成</text>
						</view>
					</view>
				</view>
			</view>
			<!--两个功能按钮-->
			<view id="btn" class="flex justify-around margin-top-sm">
				<navigator class="btn-box bg-gradual-blue flex align-center justify-center" url="historylist/oplist">
					<text class="text-xxl text-shadow">历史运维</text>
					<text class="cuIcon-write padding-left-xs" style="font-size: 90upx;opacity: 0.2"></text>
				</navigator>
				<navigator class="btn-box bg-gradual-green flex align-center justify-center" url="historylist/oalist">
					<text class="text-xxl text-shadow">历史审核</text>
					<text class="cuIcon-punch padding-left-xs" style="font-size: 90upx;opacity: 0.2"></text>
				</navigator>
			</view>
			<!--概况记录-->
			<view id="segmented" class="margin-top-sm">
				<uni-segmented-control :current="current" :values="items" style-type="text" :active-color="activeColor" @clickItem="onClickItem" />
			</view>
			<!-- class="scroll" -->
			<scroll-view id="scroll" scroll-y = "true" :style="{height:scrollHeight}">
				<view v-if="current===0" class="cu-list menu card-menu margin-top-sm" >
					<navigator :url="'EndApply?id=' + item.guid + '&type=' + item.taskType" class="cu-item" v-for="(item,key) in logList" :key = "key">
						<view class="content padding-tb-sm">
							<view><text class="cuIcon-peoplefill text-blue margin-right-xs"></text>{{item.siteName}}</view>
							<view class="text-gray ">
								<text class="cuIcon-phone margin-right-xs"></text> {{item.yunweiContent}}
							</view>
							<view class="text-gray ">
								<text class="cuIcon-timefill margin-right-xs"></text> {{item.zhidingEndTime}}
							</view>
						</view>
						<view class="action">
							<view class="cu-tag round bg-green light">详情</view>
						</view>
					</navigator>
				</view>
				<view v-if="current===1" class="cu-list menu card-menu margin-top-sm" >
					<navigator :url="'EndOaApply?id=' + item.guid + '&type=' + item.taskType" class="cu-item" v-for="(item,key) in logList" :key = "key">
						<view class="content padding-tb-sm">
							<view><text class="cuIcon-peoplefill text-blue margin-right-xs"></text>{{item.siteName}}</view>
							<view class="text-gray ">
								<text class="cuIcon-phone margin-right-xs"></text> {{item.yunweiContent}}
							</view>
							<view class="text-gray ">
								<text class="cuIcon-timefill margin-right-xs"></text> {{item.zhidingEndTime}}
							</view>
						</view>
						<view class="action">
							<!-- <view class="iconfont icontongguo my-iconfont text-green" @tap="passClick(item)">通过</view> -->
							<!-- <view class="iconfont iconweibiaoti522 my-iconfont text-red" @tap="unPassClick(item)">拒绝</view> -->
							<view class="cu-tag round bg-green light">详情</view>
						</view>
					</navigator>
				</view>
			</scroll-view>
			
		</view>
		<drag-button
			title="指派"
		    :isDock="true"
		    :existTabBar="true"
		    @btnClick="addTask"
			/>
		<!-- <audit-idea ref="popupAuditIdeaRef" :isPass="isPass" :item="selectedUserItem" :isPaddingBottom="true" @updateQuery="updateQuery"></audit-idea> -->
	</view>
</template>

<script>
	import uniSegmentedControl from '@/components/uni-segmented-control/uni-segmented-control.vue';
	import Util from '../../utils/util.js';
	import auditIdea from '../workbench/oa/audit-idea.vue'
	import dragButton from "@/components/drag-button/drag-button.vue";
	
	var that;
	export default {
		components: {uniSegmentedControl,auditIdea,dragButton},
		data() {
			return {
				isPass: false,
				selectedUserItem: {},
				current: 0,
				items: ['运维列表', '审核列表'],
				activeColor: '#66ccff',
				scrollHeight:'',
				count:{},
				today:{total:100,in_num:23,out_num:3},
				site:{},
				logList:[
					
				]
			}
		},
		onReady() {
			let _this = this;
			let segmented = uni.createSelectorQuery().select("#segmented");
			let sysinfo = uni.getSystemInfoSync();
			let Height = sysinfo.windowHeight;
			segmented.boundingClientRect(data=>{
				// console.log(data);
				let sH = (Height - data.top - 32).toFixed();
				_this.scrollHeight = sH+'px';
				// console.log(_this.scrollHeight);
			}).exec();
			
			
		}, 
		onShow:function() {
			that = this;
			let userInfo = Util.getUserInfo();
			//加载顶部统计信息
			Util.request('/monitor/taskInfo/app/opCount', {userId:userInfo.userId}, 'GET').then((res) => {
				this.count = {
					back:0,
					complete:0,
					new:0,
					operating:0,
					see:0,
				}
				res.data.map(item => {
					if(item.opStatus==='back'){
						this.count.back=item.total
					}else if(item.opStatus==='complete'){
						this.count.complete=item.total
					}else if(item.opStatus==='new'){
						this.count.new=item.total
					}else if(item.opStatus==='operating'){
						this.count.operating=item.total
					}else if(item.opStatus==='see'){
						this.count.see=item.total
					}
				})
			})
			that.getLogList()
		},
		
		methods: {
			getFileLocalPath(fileName){
				let path = fileName
				//#ifdef APP-PLUS
				path = "file:/" + plus.io.convertLocalFileSystemURL("_www"+fileName);
				//#endif
				return path
			},
			addTask() {
				uni.navigateTo({
					url:'addtask/add-task'
				})
			},
			passClick(item){
				this.selectedUserItem = item
				this.selectedUserItem.oaStatus = 'complete'
				this.isPass = true
				this.$refs.popupAuditIdeaRef.$refs.share.open()
			},
			unPassClick(item){
				this.selectedUserItem = item
				this.selectedUserItem.oaStatus = 'back'
				this.selectedUserItem.opStatus = 'operating'
				this.isPass = false
				this.$refs.popupAuditIdeaRef.$refs.share.open()
			},
			SelectSite(){
				uni.$once('site_select',function(res){
					if(res.type === 1){
						that.site = res;
					}
				});
				uni.navigateTo({
					url:'site_list/site_list'
				})
			},
			onClickItem(index) {
				if (this.current !== index) {
					this.current = index
				}
				if(index === 0){//进入记录
					that.getLogList()
				}else if(index === 1){ //外出记录
					that.getLogList()
				}
			},
			getLogList(){
				let userInfo = Util.getUserInfo();
				let status={}
				if(this.current===0){
					status.opStatus='operating'
					status.shishirenId = userInfo.userId
				}else if(this.current===1){
					status.opStatus='complete'
					status.oaStatus='ing'
					status.shenherenId = userInfo.userId
				}
				this.logList = []
				//联网加载数据
				Util.request('/monitor/taskInfo/nopage/list', status, 'GET').then(res=>{
					this.logList=res.data; //追加新数据
				}).catch(()=>{
					//联网失败, 结束加载
				})
			},
			updateQuery() {
				this.getLogList()
			}
		}
	}
</script>

<style>
	cover-image {
		position: absolute;
		left: 0;
		top: 0;
		height: 300rpx;
		width: 100%;
	}
	.main{
		position: absolute;
		top: 0;width: 100%;
	}
	.head_box{
		width: 700upx;
		height: 220upx;
		background-color: #ffffff;
		border-radius: 15upx;
	}
	.btn-box{
		width: 310upx;
		height: 150upx;
		border-radius: 20upx;
	}
	.scroll{
		height: 700rpx;
	}
</style>
